<!--
 @description 经销商分店关店-详情
 @fileName index.vue
 @author zengqiongying
 @created 2023-04-27 19:41:42
-->
<template>
  <div :class="{ 'has-foot-pb': schedule === 'A' }">
    <DetailInfo :id="id" @data-change="onDataChange" />
    <div v-if="schedule === 'A'" class="ctm-content-foot">
      <div class="btn radius-larg ctm-btn-error" @click="onStop">终止</div>
      <div class="btn radius-larg ctm-btn-main" @click="onEdit">编辑</div>
    </div>
  </div>
</template>

<script lang="ts">
  import { ref } from 'vue'
  import { useRouter, useRoute } from 'vue-router'
  import DetailInfo from './components/DetailInfo.vue'
  import { stopCustomerChange } from '../mixins/Create'
  export default {
    name: 'DealerShutUpShopDetail',
    components: { DetailInfo },
    setup() {
      const $router = useRouter()
      const $route = useRoute()
      const id = ref(`${$route.query.id || ''}`)
      const schedule = ref('')

      const onEdit = () => {
        $router.push({
          path: '/dealerFreezeAndthaw/edit',
          query: {
            id: `${id.value}`
          }
        })
      }
      const onStop = () => {
        stopCustomerChange(id.value, () => {
          schedule.value = 'B'
        })
      }
      const onDataChange = (data: any) => {
        schedule.value = data?.schedule || ''
      }

      return {
        id,
        schedule,
        onStop,
        onEdit,
        onDataChange
      }
    }
  }
</script>
<style lang="less" scoped></style>
